<template>
  <page-header-wrapper :title="false">
    <a-card
      title="快速搜索"
    >
      <a-tabs v-model="currentTab" type="card" @change="onTabs">
        <template slot="tabBarExtraContent">
          <a-input-search style="width: 500px" v-model="searchText" placeholder="输入要搜索的内容" enter-button @search="onSearch" />
        </template>
        <a-tab-pane key="1" tab="手机号"></a-tab-pane>
        <a-tab-pane key="2" tab="客户姓名"></a-tab-pane>
        <a-tab-pane key="3" tab="合同号"></a-tab-pane>
        <a-tab-pane key="4" tab="商标/专利名称"></a-tab-pane>
      </a-tabs>
      <s-table
        bordered
        ref="table"
        v-if="visible"
        :row-key="(record) => record.customer_id"
        :columns="searchColumns"
        :data="resultData"
      >
        <template slot="tm_name" slot-scope="text,record">
          {{text}}{{record.pt_name}}{{record.sb_name}}
        </template>
        <template slot="action" slot-scope="text,record">
          <a-button type="primary" size="small" @click="toDetail(record.customer_id)">查看</a-button>
        </template>
      </s-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>
import { STable } from '@/components'
// import { onSearch } from '@/api/common'
import col from '@/columns/search'
import { onSearch } from '@/api/common'
const searchColumns = col.result

export default {
  components: {
    STable
  },
  name: 'Search',
  data () {
    return {
      searchColumns,
      resultData: parameters => {
        return onSearch(Object.assign(parameters, this.queryParam)).then(res => {
          return res.result
        })
      },
      currentTab: '1',
      visible: false,
      searchText: '',
      queryParam: {}
    }
  },
  methods: {
    onTabs () {
      this.searchText = ''
      this.queryParam = {}
      this.visible = false
    },
    onSearch (value) {
      const app = this
      app.visible = false
      if (value === '') {
        app.$warning({
          title: '搜索内容不能为空'
        })
        return false
      }
      if (app.currentTab === '1') {
        app.queryParam['filter[phone]'] = value
      }
      if (app.currentTab === '2') {
        app.queryParam['filter[customer_name]'] = value
      }
      if (app.currentTab === '3') {
        app.queryParam['filter[contract_no]'] = value
      }
      if (app.currentTab === '4') {
        app.queryParam['filter[tm_name]'] = value
      }
      this.visible = true
      setTimeout(() => {
        app.$refs.table.refresh(true)
      }, 500)
    },
    toDetail (id) {
      this.$router.push({ name: 'CustomerDetail', params: { id } })
    }
  }
}
</script>

<style scoped>

</style>
